<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="http://demo.kaidandashi.com/Public/lib/layui/css/layui.css">
		<link rel="stylesheet" type="text/css" href="http://demo.kaidandashi.com/Public/lib/Hui-iconfont/1.0.8/iconfont.css"/>
		<link href="__ADMIN__/css/H-ui.min.css" rel="stylesheet" type="text/css" />
		<link href="__ADMIN__/css/H-ui.admin.css" rel="stylesheet" type="text/css" />
		<link href="__ADMIN__/css/style.css" rel="stylesheet" type="text/css" />
		<link href="__ADMIN__/lib/Hui-iconfont/1.0.7/iconfont.css" rel="stylesheet" type="text/css" />
		<style type="text/css">
			body, html,#allmap {width: 98%;height: 90%;margin:1%;font-family:"微软雅黑";}
		</style>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2&ak=0Qt8S1ScE8xestrsNmpYruGhz9LF2gG1"></script>
		<title>应急救援物资展示</title>
	</head>
	<body>
		<!-- 框架显示面包屑导航 start -->
	<block name="breadcrumb">
		<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i>首页<span class="c-gray en">&gt;</span> 智慧安监 <span class="c-gray en">&gt;</span> 应急救援物资展示 <a class="btn btn-success radius r mr-20" id="btn-refresh" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
	</block>
<!-- 框架显示面包屑导航 end -->
		<div id="allmap"></div>
	</body>
</html>
<script type="text/javascript" src="http://demo.kaidandashi.com/Public/lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://demo.kaidandashi.com/Public/lib/layer/2.4/layer.js"></script>
<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	map.centerAndZoom(new BMap.Point(118.658935,34.930043), 12);  // 初始化地图,设置中心点坐标和地图级别
    map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
    map.setCurrentCity("临沂");          // 设置地图显示的城市 此项是必须设置的
    map.enableScrollWheelZoom(true); 

 	var data = <{$zuobiao}>;
 	//console.log(data);
    // var points = JSON.stringify(data).replace(/\}/g,"\"\]").replace(/\{/g,"\"\[").replace(/\"/g, "");
    // console.log(points);
    // var datas = eval('(' + points + ')');
    //console.log(datas);
    //
    	
    	for(var i=0;i<data.length;i++){
    	var lng = data[i][0];
    	var lngs = eval('(' + lng + ')')
    	var lat = data[i][1];
    	var lats = eval('(' + lat + ')')
        var myIcon = new BMap.Icon('http://anjian.ichenchao.com/Statics/Admin/red-flag.png',new BMap.Size(30,30));
		var mkr = new BMap.Marker(new BMap.Point(lngs,lats),{icon:myIcon});
		 
		var opts = {
			  position : new BMap.Point(lngs,lats),    // 指定文本标注所在的地理位置
			  offset   : new BMap.Size(-30, 20)    //设置文本偏移量
			}
			var label = new BMap.Label(data[i][3], opts);  // 创建文本标注对象
				label.setStyle({
				 border:"0",
				 color : "blue",
				 opacity:"0.5",
				 fontSize : "14px",
				 height : "20px",
				 lineHeight : "20px",
				 fontWeight:"bold",
				 fontFamily:"微软雅黑"
			 });
		map.addOverlay(label); 
		// //循环添加标注点击事件后显示出来的文本信息框的信息 (为了使文本框信息不重复) 需要用到闭包,否则只会显示最后一个数据
		(function(){
			var index = i;
			mkr.addEventListener("click", function(){
					this.openInfoWindow(new BMap.InfoWindow("位置：" +data[index][3], {width: 200,height: 0,title: data[index][2],enableMessage: false}));
			}); //在图标实例上添加鼠标点击事件
		})();
		map.addOverlay(mkr);		//将覆盖物添加到地图中,一个覆盖物实例只能向地图中添加一次 
	}
 
	
	
	//单击获取点击的经纬度
	map.addEventListener("click",function(e){
		$('#zuobiao').val(e.point.lng + "," + e.point.lat);
	});
	$('#queding').on('click', function(){
		var index = parent.layer.getFrameIndex(window.name);
		var zuobiao=$('#zuobiao').val();
		parent.$('#zuobiao').val(zuobiao);
		parent.layer.close(index);
	});
	map.addControl(new BMap.MapTypeControl());//添加地图类型控件
	map.enableScrollWheelZoom(true);//开启鼠标滚轮缩放
	map.enableInertialDragging();
	map.enableContinuousZoom();
	// 添加带有定位的导航控件
	var navigationControl = new BMap.NavigationControl({
		// 靠左上角位置
		anchor: BMAP_ANCHOR_TOP_LEFT,
		// LARGE类型
		type: BMAP_NAVIGATION_CONTROL_LARGE,
		// 启用显示定位
		enableGeolocation: true
	});
	map.addControl(navigationControl);
	// 添加定位控件
	var geolocationControl = new BMap.GeolocationControl();
	geolocationControl.addEventListener("locationSuccess", function(e){
		// 定位成功事件
		var address = '';
		address += e.addressComponent.province;
		address += e.addressComponent.city;
		address += e.addressComponent.district;
		address += e.addressComponent.street;
		address += e.addressComponent.streetNumber;
		alert("当前定位地址为：" + address);
	});
	geolocationControl.addEventListener("locationError",function(e){
		// 定位失败事件
		alert(e.message);
	});
	map.addControl(geolocationControl);
	var size = new BMap.Size(75, 20);
	map.addControl(new BMap.CityListControl({
		anchor: BMAP_ANCHOR_TOP_LEFT,
		offset: size,
		// 切换城市之间事件
		// onChangeBefore: function(){
		//    alert('before');
		// },
		// 切换城市之后事件
		// onChangeAfter:function(){
		//   alert('after');
		// }
	}));
	$(function(){
		$('#chazhao').click(function(){
			function $(sousuo){
				return document.getElementById(sousuo);
			}
			var citys=new BMap.LocalSearch(map,{renderOptions:{map:map,autoViewport:true}});
			map.clearOverlays();
			var c=$("txtCity").value;
			citys.search(c);
			var s=$("txtSearch").value;
			var local = new BMap.LocalSearch(c, {
				renderOptions:{map: map}
			});
			local.search(s);
		})
	})
	$("#tishi").click(function(){
		layer.open({
			type: 2,
			title: '',
			shadeClose: true,
			shade: false,
			maxmin: true, //开启最大化最小化按钮
			area: ['330px', '270px'],
			content: ''
		});
	})
</script>